<%--
  Created by IntelliJ IDEA.
  User: Lanan
  Date: 2017/12/18 0018
  Time: 16:23
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/commons/global.jsp" %>
<html>
<head>
    <%@ include file="/commons/basejs.jsp" %>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>用户账户管理</title>
</head>
<body>
<table id="user_account" title="用户账户信息列表" class="easyui-datagrid"
       data-options="
   		url:'${path}/user/account/list.do',
		fit:true,
		idField:'id',
		rownumbers:true,
		toolbar:'#tools',
		loadMsg:'正在处理，请等待......',
		pagination:true,
		fitColumns:true,
		singleSelect:true,
		nowrap:false,
   		">
    <thead>
    <th data-options="field:'id', align:'center', checkbox:true">ID</th>
    <th data-options="field:'name', align:'center'">用户名</th>
    <th data-options="field:'phone', align:'center'">用户电话</th>
    <th data-options="field:'wechatAccount', align:'center'">微信账号</th>
    <th data-options="field:'aliAccount', align:'center'">支付宝账号</th>
    <th data-options="field:'bankAccount', align:'center'">银行账号</th>
    <th data-options="field:'bankName', align:'center'">银行名称</th>
    <th data-options="field:'bankOpening', align:'center'">开户行信息</th>
    <th data-options="field:'type', align:'center', formatter:formatAccountType">账户类型</th>
    <th data-options="field:'def', align:'center', formatter:formatAccountDef">是否默认</th>
    <th data-options="field:'createTime', align:'center', formatter:formatDatebox">创建时间</th>
    <th data-options="field:'updateTime', align:'center', formatter:formatDatebox">更新时间</th>
    </thead>
</table>
<div id="tools">
    <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-reload'" onclick="refreshUserAccountList()">刷新</a>

    <shiro:hasPermission name="/user/account/insert.do">
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add'" onclick="openAddUserAccountBox()">添加</a>
    </shiro:hasPermission>
    <shiro:hasPermission name="/user/account/update.do">
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit'" onclick="openUpdateUserAccountBox()">修改</a>
    </shiro:hasPermission>
    <shiro:hasPermission name="/user/account/delete.do">
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-remove'" onclick="deleteUserAccount()">删除</a>
    </shiro:hasPermission>

    <form action="#" id="searchForm">
        <label>用户:</label>
        <div style="position: relative;height:15px;width:170px;top:2px; display:inline-block;">
            <input type="text" name="searchUserInfo" id="searchUserInfo" value="" hidden/>
            <input type="text" id="autocomplete-ajax-search" style="position: absolute; z-index: 2; background: transparent;"/>
            <input type="text" id="autocomplete-ajax-search-x" disabled="disabled" style="color: #CCC; position: absolute; background: transparent; z-index: 1;"/>
        </div>
        <label>账号:</label>
        <input class="easyui-textbox" id="searchUserAcount" name="searchUserAcount" data-options="prompt:'请输入搜索账号'"/>
        <label>账户类型:</label>
        <select id="typeSearchWord" name="typeSearchWord" class="easyui-combobox" data-options="width:'70px', editable:false, panelHeight:'auto'">
            <option value="">全部</option>
            <option value="0">银行卡</option>
            <option value="1">支付宝</option>
            <option value="2">微信</option>
        </select>
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'" onclick="searchUserAccount()">搜索</a>
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-clear'" onclick="searchUserAccountReset()">重置</a>
    </form>
</div>
<!-- 数据表格 end -->


<script type="text/javascript">


    function searchUserAccount() {
        var queryParams = {};
        queryParams.userId = $("#searchUserInfo").val();
        queryParams.account = $("#searchUserAcount").val();
        queryParams.type = $("#typeSearchWord").combobox("getValue");
        $("#user_account").datagrid('options').queryParams = queryParams;
        $("#user_account").datagrid('getPager').data("pagination").options.pageNumber = 1;
        var select = $('#user_account').datagrid('getSelected');
        if(select != null){
            $('#user_account').datagrid('clearSelections');
        }
        $("#user_account").datagrid('reload');
    }

    function searchUserAccountReset() {
        $("#searchForm").form('clear');
        $("#typeSearchWord").combobox('setValue', "");
    }


    $(function () {
        autoCompleteDate('${path}/user/address/autoCompleteData.do', 'autocomplete-ajax-search', 'searchUserInfo', 'autocomplete-ajax-search-x');
    })

    function formatAccountType(value) {
        if (value == 0) return '<span style="color:green">' + '银行卡' + '</span>';
        else if (value == 1) return '<span style="color:#f93">' + '支付宝' + '</span>';
        else if (value == 2) return '<span style="color:red">' + '微信' + '</span>';
    }

    function formatAccountDef(value) {
        if (value == 0) return '<span style="color:lightgrey">' + '否' + '</span>';
        else if (value == 1) return '<span style="color:black">' + '是' + '</span>';
    }

    function refreshUserAccountList() {
        $("#user_account").datagrid("reload");
    }


    function deleteUserAccount() {
        lananDelete("user_account", "确定删除该条用户账号信息?", "${path}/user/account/delete.do");
    }

    function openAddUserAccountBox () {
        $.modalDialog({
            title : '添加用户账号信息',
            id:'user_acount_insert_dialog',
            width : 500,
            height : 350,
            href : '${path }/user/account/insert/index.do',
        });
    }

    function openUpdateUserAccountBox() {
        var select = $("#user_account").datagrid("getSelected");
        if(select == null){
            $.messager.alert("提示","请选择要修改的用户账户信息！","info");
            return;
        }
        $.modalDialog({
            title : '修改用户账号信息',
            id:'user_acount_update_dialog',
            width : 500,
            height : 350,
            href : '${path}/user/account/update/index.do?id=' + select.id,
        });
    }

</script>

</body>
</html>
